<!-- 工作状态 -->
<template>
	<view class="state">
		<div class="list" v-for="item,index in list" :key="item.id">
			<div class="li" v-if="list[index].status=='1'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="two">为了更好的明天，大家一起努力。</div>
					<div class="three">
						<image src="../../../static/diImage/定位.png" mode=""></image>
						<div class="p">广东省深圳市南山区科技园中区科苑路15号</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
						<image src="../../../static/diImage/爱心.png" mode=""></image>
						<image src="../../../static/diImage/微信.png" mode=""></image>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='2'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="four">
						<div class="left">
							<div class="p">成交订单：DD20190324010001</div>
							<div class="p">成交金额：¥10,000.00</div>
							<div class="p">客户名称：深圳木卫二科技有限公司</div>
						</div>
						<div class="right">
							<image src="../../../static/diImage/徽章.png" mode=""></image>
							<div class="p" style="color: red;">喜报</div>
						</div>
						
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
						<image src="../../../static/diImage/爱心.png" mode=""></image>
						<image src="../../../static/diImage/微信.png" mode=""></image>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='3'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">创建客户</div>
						<div class="p">深圳木卫二科技有限公司</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='4'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">创建线索</div>
						<div class="p">深圳木卫二科技有限公司</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='5'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">创建商机</div>
						<div class="p">深圳木卫二科技有限公司</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='6'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">创建联系人</div>
						<div class="p">李小红</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='7'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">提交工作报告</div>
						<div class="p">2019-04-22 工作日报</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='8'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">上传共享文件</div>
						<div class="p">合同模版.xls</div>
					</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			<div class="li" v-if="list[index].status=='9'">
				<div class="left">
					<image src="../../../static/diImage/头像.png" mode=""></image>				
				</div>
				<div class="right">
					<div class="one">
						<div class="spans">{{item.Vesting}}</div>
						<div class="span">{{item.department}}</div>
					</div>
					<div class="three">
						<div class="p" style="margin-right: 20rpx;color: #666666;">写进跟进</div>
						<div class="p">深圳木卫二科技有限公司</div>
					</div>
					<div class="pp" style="color: #666666;">上门拜访了客户，客户对产品意向很高，但是希望价格能有优惠。</div>
					<div class="five">
						<div class="p">
							<image src="../../../static/diImage/时钟.png" mode=""></image>
							<view>{{item.followTime}}</view>
						</div>
					</div>
				</div>
			</div>
			
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[]
			}
		},
		methods: {
			
		},
		created() {
			uni.request({
			  url: "http://127.0.0.1:3000/salesLead/getAll", //接口地址
			  method: "POST",
			  success: (res) => {
			    this.list = res.data.data;
			    console.log(this.list,'获取到的数据');
			  },
			});
		}
	}
</script>

<style lang="scss">
.state{
	width: 100%;
	height: 100%;
	.list{
		width: 100%;
		overflow: auto;
		background-color:#fefefe;
		.li{
			width: 100%;
			padding: 20rpx;
			display: flex;
			margin-bottom: 20rpx;
			border: 1px solid gainsboro;
			border-radius: 20rpx;
			.left{
				image{
					width: 80rpx;
					height: 80rpx;
					margin-right: 20rpx;
				}
			}
			.right{
				.one{
					display: flex;
					.spans{
						margin-right: 20rpx;
						font-weight: 600;
					}
					.span{
						color: #666666;
					}
				}
				.two{
					margin-top: 30rpx;
					color: #666666;
				}
				.three{
					display: flex;
					margin-top: 30rpx;
					.p{
						color: #0079fe;
						font-size: 26rpx;
					}
				}
				.five{
					margin-top: 30rpx;
					display: flex;
					justify-content: space-between;
					.p{
						display: flex;
						color: #666666;
					}
					image{
						margin-right: 10rpx;
					}
				}
				.four{
					display: flex;
					.left{
						.p{
							margin-top: 30rpx;
							font-size: 30rpx;
						}
					}
					.right{
						display: flex;
						flex-direction: column;
						justify-content: space-evenly;
						align-items: center;
						image{
							width: 80rpx;
							height: 80rpx;
						}
					}
				}
			}
		}
	}
}
image{
	width: 40rpx;
	height: 40rpx;
}
</style>
